feat(ResponseActions): Add click state #382
Open
+283
−51
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Preview: https://chatbot-pr-chatbot-382.surge.sh A11y report: https://chatbot-pr-chatbot-382-a11y.surge.sh |
rebeccaalpert
force-pushed
the
response-action-clicked
branch
3 times, most recently
from
d39d4ea to
ef0b576
Compare
edonehoo
requested changes
Dec 13, 2024
| @@ -79,7 +79,7 @@ You can add actions to a message, to allow users to interact with the message co | |||
|
|
|||
| ### Custom message actions | |||
|
|
|||
| Beyond the standard message actions (positive, negative, copy, share, or listen), you can add custom actions to a bot message by passing an `actions` object to the `<Message>` component. This object can contain the following customizations: `ariaLabel`, `onClick`, `className`, `isDisabled`, `tooltipContent`, `tooltipProps`, and `icon`. | |||
| Beyond the standard message actions (positive, negative, copy, share, or listen), you can add custom actions to a bot message by passing an `actions` object to the `<Message>` component. This object can contain the following customizations: `ariaLabel`, `clickedAriaLabel`, `onClick`, `className`, `isDisabled`, `tooltipContent`, `tooltipContent`, `tooltipProps`, and `icon`. `clickedAriaLabel` and `clickedTooltipContent` are applied only when a button is clicked. If `clickedAriaLabel` or `clickedTooltipContent` are omitted, they will default to the `ariaLabel` or `tooltipContent` supplied. | |||
There was a problem hiding this comment.
Suggested change
| Beyond the standard message actions (positive, negative, copy, share, or listen), you can add custom actions to a bot message by passing an `actions` object to the `<Message>` component. This object can contain the following customizations: `ariaLabel`, `clickedAriaLabel`, `onClick`, `className`, `isDisabled`, `tooltipContent`, `tooltipContent`, `tooltipProps`, and `icon`. `clickedAriaLabel` and `clickedTooltipContent` are applied only when a button is clicked. If `clickedAriaLabel` or `clickedTooltipContent` are omitted, they will default to the `ariaLabel` or `tooltipContent` supplied. | |
| Beyond the standard message actions (good response, bad response, copy, share, or listen), you can add custom actions to a bot message by passing an `actions` object to the `<Message>` component. This object can contain the following customizations: | |
| - `ariaLabel` | |
| - `onClick` | |
| - `className` | |
| - `isDisabled` | |
| - `tooltipContent` | |
| - `tooltipContent` | |
| - `tooltipProps` | |
| - `icon` | |
| You can apply a `clickedAriaLabel` and `clickedTooltipContent` once a button is clicked. If either of these props are omitted, their values will default to the `ariaLabel` or `tooltipContent` supplied. |
do you think changing this to a list is more digestible?
Another idea is to remove the list of props and just link to the props table, since there's more context for each of these props down there? I think I lean to this solution if you think it's okay, but I'll let you choose between the 2!
Beyond the standard message actions (good response, bad response, copy, share, or listen), you can add custom actions to a bot message via the
actionsobject props.You can apply a
clickedAriaLabelandclickedTooltipContentonce a button is clicked. If either of these props are omitted, their values will default to theariaLabelortooltipContentsupplied.
There was a problem hiding this comment.
I'd love to do option 2, but we have a problem with the docs framework right now where if you click an anchor link, it doesn't take you there, and I hate it. If it's ok with you, I'll go with the first one for now and we can totally change it later.
packages/module/patternfly-docs/content/extensions/chatbot/examples/Messages/Messages.md
Show resolved
Hide resolved
rebeccaalpert
force-pushed
the
response-action-clicked
branch
from
26e9dab to
91d345f
Compare
Add click state to response actions block. The last currently selected item will remain selected. Clients can also pass in custom tooltips or aria labels based on the clicked state.
…mples/Messages/Messages.md Co-authored-by: Erin Donehoo <105813956+edonehoo@users.noreply.github.com>
rebeccaalpert
force-pushed
the
response-action-clicked
branch
from
91d345f to
64633dc
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Add click state to response actions block. The last currently selected item will remain selected until you click someone else on the screen. Clients can also pass in custom tooltips or aria labels based on the clicked state.
Docs:
I've been working directly with Kayla on these already - she has seen them.